<template>
    <div class="main">
      0000
    <div class="title">
        <a href="/Mainpage/AdvIntro"  id="jump">这是我们的系统 </a>
    </div>
    </div>
</template>
<script setup>
import {onMounted} from "vue";
// import {useRoute} from "vue-router/composables";
//
// const route = useRoute();
onMounted(()=>{
})
</script>
<style scoped>
 *{
            padding: 0;
            margin: 0;
        }
        .main{
            //background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)), url('../assets/Index_bgimg.jpg');
            height: 100vh;
            background-size: cover;
            background-position: center;
        }
        .title{
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
            background-color: rgba(233, 237, 240, 0.062);
            padding: 5px;
            border-radius: 10%;
        }
        .title{
            color: rgba(220, 229, 230, 0.226);
            font-size: 80px;
            font-family: Century Gothic;
        }
        .title :hover{
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%,-50%);
            background-color: rgba(233, 237, 240, 0.062);
            padding: 5px;
            border-radius: 10%;
            background-color:  rgba(220, 229, 230, 0.267);; /* 鼠标悬停时的背景颜色 */
        }
        #jump {
            text-decoration: none; /* 移除下划线 */
            color: #ffffff; /* 文字颜色 */
            padding: 10px 20px; /* 内边距 */
            border-radius: 5px; /* 圆角边框 */
            font-size: 80px; /* 字体大小 */
            transition: background-color 0.3s ease; /* 平滑过渡效果 */
            display: inline-block; /* 使内边距生效 */
        }
        #jump:hover {
            text-decoration: none; /* 鼠标悬停时保持无下划线 */
        }

</style>
<script>

export default {
    name: 'IndexPage',
    data(){
        return {}
    }
}
</script>
